/**
 * 设置页面
 */

define(["jquery",'bootstrap','bootstrapTable'], function($){

    // 路径
    var path;
    // 页面初始化
    function initEvents(){
        window.actionEvents = {'click #btn':function(e,value,row,id){
            e.preventDefault();
            $('#myModal').on('show.bs.modal', function (e) {
                $('#modalContent').empty();
                $('#modalContent').html(value)
            })
            // $('#modalContent').empty();
            // $('#modalContent').html(value)
            $('#myModal').modal()
        }}
            $('#table').bootstrapTable({
                method: 'get',
                // toolbar: '#toolbar',    //工具按钮用哪个容器
                striped: false,      //是否显示行间隔色
                cache: false,      //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,     //是否显示分页（*）
                sortable: true,      //是否启用排序
                sortName:'id',
                sortOrder: "desc",     //排序方式
                pageNumber:1,      //初始化加载第一页，默认第一页
                pageSize: 10,      //每页的记录行数（*）
                pageList: [10, 25, 50, 100],  //可供选择的每页的行数（*）
                url: "asset/data/table.json",//这个接口需要处理bootstrap table传递的固定参数
                queryParamsType:'', //默认值为 'limit' ,在默认情况下 传给服务端的参数为：offset,limit,sort
                                    // 设置为 ''  在这种情况下传给服务器的参数为：pageSize,pageNumber

                //queryParams: queryParams,//前端调用服务时，会默认传递上边提到的参数，如果需要添加自定义参数，可以自定义一个函数返回请求参数
                sidePagination: "server",   //分页方式：client客户端分页，server服务端分页（*）
                //search: true,      //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                strictSearch: true,
                //showColumns: true,     //是否显示所有的列
                //showRefresh: true,     //是否显示刷新按钮
                minimumCountColumns: 2,    //最少允许的列数
                clickToSelect: true,    //是否启用点击选中行
                // searchOnEnterKey: true,
                // selectItemName: 'id',
                // search: true,
                height: $(window).height() - 150,
                columns: [
                    {
                        checkbox: true, // 显示一个勾选框
                        align: 'center' // 居中显示
                    },
                    {
                    field: 'name',
                    title: 'id',
                    align: 'center',
                    valign: 'middle'

                }, {
                    field: 'name',
                    title: 'name',
                    align: 'center',
                        valign: 'middle'
                }, {
                    field: 'price',
                    title: 'price',
                    align: 'center',
                        valign: 'middle'
                },
                    {
                    field: 'id',
                    title: '操作',
                    align: 'center',
                    // formatter:function(value,row,index){
                    //     //通过formatter可以自定义列显示的内容
                    //     //value：当前field的值，即id
                    //     //row：当前行的数据
                    //     var a = '<button onclick="fn(\'' + value + '\')">测试</button>';
                    //     var e = '<a onclick="onEditClick(\''+ value +'\')">编辑</a> ';
                    //     return a+e;
                    // }
                    events: actionEvents,
                    formatter:actionFormatter

                }],
                pagination:true,
                onLoadSuccess: function(){  //加载成功时执行
                    console.info("加载成功");
                }
            });

        function actionFormatter(value,row,id){
           return [
                '<button id="btn" class="btn btn-primary">详情</button>'
            ].join('');
        }


    }

    return {
        init: function(options){
            options = $.extend(true, {}, options);
            path = 'html/pages/setting.html';
            $('#mainContent').load(path, function(){
                initEvents();
                options.callback();
            })


        }
    }
})
